<template>
  <div >
    <h1 align="center" style="margin:50px auto 80px auto">企业基本信息</h1>
  <el-table  
    :data="tableData.filter(data =>
     (!searchname || data.companyName.toLowerCase().includes(searchname.toLowerCase()))
     && (!searchnum || data.companyCode== (searchnum*1) )
     && (!searchdate || data.idType.toLowerCase().includes(searchdate.toLowerCase()))
     && (!searchzheng || data.idNumber.toLowerCase().includes(searchzheng.toLowerCase()))
  && (!searchzhengnum || data.createDate.toLowerCase().includes(searchzhengnum.toLowerCase()))
  && (!searchDel ||data.isDel== (searchDel*1) )
      )"

    style="border:grey solid;border-width:3px 0 0 0;">
   <el-table-column
      label="企业编号"
      prop="companyCode" style="background:lightblue">
    </el-table-column>
    <el-table-column
      label="企业名称"
      prop="companyName">
    </el-table-column>
    <el-table-column
      label="证件类型"
      prop="idType">
    </el-table-column>
    <el-table-column
      label="证件号码"
      prop="idNumber">
    </el-table-column>
    <el-table-column
      label="企业成立日期"
      prop="createDate">
    </el-table-column>
    <el-table-column
      label="注册资本（万元）"
      prop="registerCapital">
    </el-table-column>
    <el-table-column
      align="right">
      <template  style="" slot="header"  slot-scope="scope"> 
         
          <el-input
          v-model="searchnum"
          size="mini"
          placeholder="输入企业编号" />
        
          <el-input
          v-model="searchname"
          size="mini"
          placeholder="输入企业名称" />
           <el-input
          v-model="searchzheng"
          size="mini"
          placeholder="输入证件类型"  />
          <el-input
          v-model="searchzhengnum"
          size="mini"
          placeholder="输入证件号码"  />
           <el-input
          v-model="searchdate"
          size="mini"
          placeholder="输入企业成立日期"  /> 
        <el-button
          size="mini"
          @click="resetInput(scope.row.companyCode)"></el-button>
         
      </template>
      <template slot-scope="scope">
        <el-button
          size="mini"
          @click="handleCheck(scope.row.companyCode)">查看</el-button>
        <el-button
          size="mini"
         
          @click="handleEdit(scope.row.companyCode)">修改</el-button>
           <el-button
          size="mini"
          type="danger"
          @click="handleDelete(scope.row.companyCode)">删除</el-button>
      </template>
    </el-table-column>
  </el-table>
   <div style="margin:50px auto 0 auto ;width:fit-content">
        <el-button type="primary" @click="returnIndex">返回主页</el-button>  
        <el-button type="primary" @click="addmessage">新增企业</el-button>  
    </div>
    </div>
</template>

<script>
import {messageToShow,deletemessageInfo} from '@/api/message/index'
  export default {
   
    data() {
      return {
        tableData: [],
        searchnum: '',
        searchname: '',
        searchzheng: '',
        searchzhengnum: '',
        searchdate: '',
        searchDel: '0'
      }
    },
    methods: {
       returnIndex(){
         this.$router.replace('/index')
       },
        addmessage(){
         this.$router.replace('/messageadd')
       },
      handleCheck(row) {
        this.$router.push({
          path: '/messagedetail',
          query: {
            companyCode: row
          }
        })
      },
      
      handleDelete(row) {
        console.log(row)
        deletemessageInfo(row).then(res=>{
          this.showMessage(res)
        })
      },
      handleEdit(row) {
        this.$router.push({
          path: '/messageedit',
          query: {
            companyCode: row
          }
        })
      },

      showMessage(){
        messageToShow().then(res => {
           console.log(res)
           this.tableData = res
        }).catch((e) => {console.log(e )})
      },
    },
    mounted (){
      this.showMessage()
    }
  }
</script>





   
 



